<template>
	<view style="overflow: hidden;">
		<view class="tm">
			条码:
			<input type="text" v-model="tm" @blur="getInfo" :disabled="true">
			<!-- <button @tap="saomiao">扫描</button> -->
		</view>
		<scroll-view scroll-y="true" scroll-x="true" style="width: 800upx; height: 83vh;">
			<view class="btminfo">
				<t-table style='width: 100%;z-index: 10;'>
					<t-tr>
						<t-td style="flex: 0 0 120upx;word-break: break-all;">货号</t-td>
						<t-td style="flex: 0 0 100upx;word-break: break-all;">颜色</t-td>
						<t-td style="flex: 0 0 80upx;word-break: break-all;">尺码</t-td>
						<t-td style="flex: 0 0 80upx;word-break: break-all;">数量</t-td>
						<t-td style="flex: 1;word-break: break-all;">条码</t-td>
					</t-tr>
					<t-tr v-for="(item,index) in arr" :key="index">
						<t-td style="flex: 0 0 120upx;word-break: break-all;">{{item.bbreed}}</t-td>
						<t-td style="flex: 0 0 100upx;word-break: break-all;">{{item.color}}</t-td>
						<t-td style="flex: 0 0 80upx;word-break: break-all;">{{item.chima}}</t-td>
						<t-td style="flex: 0 0 80upx;word-break: break-all;">{{item.sl}}</t-td>
						<t-td style="flex: 1;word-break: break-all;">{{item.barcode}}</t-td>
					</t-tr>
				</t-table>
			</view>
		</scroll-view>
		
		<view style="text-align: center;color: #f0301f;font-size: 40upx;border-top: 1px solid #ccc;">
			已扫描{{num}}个条码
		</view>
		<scanCode></scanCode>
	</view>
</template>

<script>
	import scanCode from '@/static/scan-code/scan-code.vue';
	// import Voice from '@/static/voice.js'; //语音文件
	import axios from '@/static/axios.js';
	import tTable from '@/static/t-table/t-table.vue'
	import tTh from '@/static/t-table/t-th.vue'
	import tTr from '@/static/t-table/t-tr.vue'
	import tTd from '@/static/t-table/t-td.vue'
	const TTSSpeech = uni.requireNativePlugin("MT-TTS-Speech");
	export default {
		components: {
			scanCode,
			tTable,
			tTh,
			tTr,
			tTd
		},
		data() {
			return {
				tm: '',
				url: '',
				arr: [],
				uid: '',
				uname: '',
				bbreed: '',
				pinpai: '',
				khhh:'',
				color: '',
				chima: '',
				sl: '',
				isyp: '',
				temp:[],
				isShow: true,
			}
		},
		computed: {
			num() {
				return this.arr.length ? this.arr.length : 0
			}
		},
		onBackPress(e) {
			console.log(e);
			uni.redirectTo({
				url: '../index/index'
			})
		},
		onLoad() {
			this.url = uni.getStorageSync('url') == '' ? this.websiteUrl : uni.getStorageSync('url')
			this.uid = uni.getStorageSync('uid')
			this.uname = uni.getStorageSync('uname')
			this.isyp = uni.getStorageSync('isyp')
			console.log('成品入库');
			TTSSpeech.init((status) => {
				if (status === 0) {
					// console.log('引擎初始化成功')
				}
			}, 'com.iflytek.speechcloud')
			var _this = this
			uni.$off('scancodedate')
			uni.$on('scancodedate', function(content) {
				_this.tm = content
				_this.getInfo(content)
			})
		},
		methods: {
			getInfo(content) {
				var _this = this
				let uuid = _this.guid()
				uni.request({
					url:`http://${_this.url}/bService.asmx/Check_Barcode`,
					method:'GET',
					data:{
						ls_barcode: content,
						ls_worktype: "880",
						ls_type: '半成品入库',
						ll_sl: '0',
						uid: _this.uid,
						uuid: uuid
					},
					success: (r) => {
						console.log(r)
						// Voice(r.data.msg, true)
						TTSSpeech.speak({
							text: r.data.msg
						})
						uni.showToast({
							title: r.data.msg,
							icon: 'none',
							duration: 3000
						})
					    if(r.data.code == '666') {
							_this.arr = _this.arr.concat(r.data.data[0])
						}
						_this.tm = content
					},
					complete: (r) => {
						if (r.statusCode != 200) {
							uni.showToast({
								title: '网络请求失败!',
								icon: 'none',
								duration: 3000
							})
						}
					}
				})
			},
			saomiao() {
				let _this = this
				uni.scanCode({
					onlyFromCamera: true,
					scanType: ['qrCode', 'barCode'], //这里有个坑，不写的话扫描速度有点慢
					success: (res) => {
						if (res.result) {
							this.this.tm = res.result
							this.getInfo()
						}
					}
				})
			},
			guid() {
				return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
					var r = Math.random() * 16 | 0,
						v = c == 'x' ? r : (r & 0x3 | 0x8);
					return v.toString(16);
				});
			}
		}
	}
</script>

<style>
	.tm {
		height: 8vh;
		padding: 0 10upx;
		display: flex;
		align-items: center;
		width: 100%;
		font-size: 40upx;
	}

	.tm input {
		border: 1px solid #ccc;
		border-radius: 6upx;
		width: 80%;
	}

	.tm button {
		height: 60upx;
		line-height: 60upx;
		background-color: #4ec7eb;
		color: #FFFFFF;
		width: 21%;
	}

	.list {
		height: 80upx;
		padding: 0 20upx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
	}

	.list>view {
		width: 50%;
		display: flex;
		align-items: center;
	}


	.btminfo {
		width: 100%;
		height: 84vh;
		overflow-y: auto;
	}

	.ckInfo {
		display: flex;
		align-items: center;
		padding: 0 10upx;
		width: 50%;
	}

	.ckInfo text {
		display: inline-block;
		width: 200upx;
	}

	.ckInfo input {
		border: 1px solid #CCCCCC;
		border-radius: 6upx;
	}

	.sure {
		height: 80upx;
		line-height: 80upx;
		color: #FFFFFF;
		background-color: #4ec7eb;
		width: 100%;
	}
	.statistics{
		width: 160rpx;
		height: 160rpx;
		line-height: 160rpx;
		border-radius: 50%;
		background-color: #4ec7eb;
		color: #FFFFFF;
		position: fixed;
		bottom: 20vh;
		right: 20rpx;
	}
</style>